<template>
	<el-tabs class="pageTabs">
		<el-tab-pane label="进行中">

			<div style="margin-bottom: 15px;">
				<el-button-group>
					<el-button disabled>回复</el-button>
					<el-button disabled>隐藏</el-button>
					<el-button disabled>删除</el-button>
					<el-button disabled>禁止回复</el-button>
				</el-button-group>
			</div>

			<el-table :data="tableData">
				<el-table-column type="selection" width="50"></el-table-column>
				<el-table-column label="头像" width="100">
					<template #default="scope">
						<el-avatar shape="square" :size="50">{{scope.row.name}}</el-avatar>
					</template>
				</el-table-column>
				<el-table-column prop="name" label="姓名" width="180"></el-table-column>
				<el-table-column prop="date" label="日期" width="180"></el-table-column>
				<el-table-column prop="address" label="地址" width="280"></el-table-column>
				<el-table-column minWidth="1"></el-table-column>
				<el-table-column fixed="right" label="操作" width="100">
					<template #default="scope">
						<el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
						<el-button type="text" size="small">编辑</el-button>
					</template>
				</el-table-column>
			</el-table>

			<el-pagination background layout="prev, pager, next" :total="24" :hide-on-single-page="true" style="margin-top: 30px;text-align: center;"></el-pagination>


		</el-tab-pane>
		<el-tab-pane label="已完成">已完成</el-tab-pane>
		<el-tab-pane label="全部">全部</el-tab-pane>
	</el-tabs>
</template>

<script>
	export default {
		data() {
			return {
				tableData: [{
					date: '2016-05-02',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1518 弄'
				}, {
					date: '2016-05-04',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1517 弄'
				}, {
					date: '2016-05-01',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1519 弄'
				}, {
					date: '2016-05-03',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1516 弄'
				}]
			}
		}
	}
</script>

<style>
</style>
